<template>
    <div class="commentpb">
        <!-- （'+com_count+'） -->
        <van-cell :title="'全部评论'" />
        <van-list
            v-model="loading"
            :finished="finished"
            finished-text="没有更多了"
            @load="onLoad"
            >
            <!-- 评论item组件 -->
            <!-- {{list}} -->
            <CommentItem v-for="(item,index) in list" :key="index" :commentcon="item" :replytype="replytype" @likecomment="likecomment"/>
        </van-list>
    </div>
    
</template>

<script>
import {getcomment} from '@/api/article';
import CommentItem from './CommentItem';
// import CommentItem from '@/components/CommentItem'
export default {
  name:'Comment',
  components: {CommentItem},
  props: {
    source:{required:true,type:String},
    list:{
      type:Array,
      default:()=>[],
    },
    type:{required:true,type:String},
    replytype:{type:String}
  },
  data() {
    return {
      num:0,
      offset:null,
      loading: false,
      finished: false,
      com_count:0
    };
  },
  watch: {},
  computed: {
    
  },
  methods: {
    async onLoad() {
    // 异步更新数据
    // setTimeout 仅做示例，真实场景中一般为 ajax 请求
       try{
            const {data}=await getcomment({type:this.type,source:this.source,limit:'10',offset:this.offset||''})
            this.list.push(...data.data.results)
            console.log(this.list)
            this.com_count=data.data.total_count
            this.loading=false;
            if(data.data.results.length<10){
                this.finished=true;
            }else{
                this.offset=data.data.results[9].com_id
            }
       }
       catch(err){
           this.$toast('获取评论失败')
           console.log(err)
       }
    },
    async likecomment(index){
      
      
    },
  },
  created() {
    // this.$bus.$on('chReplyNum',()=>{this.onLoad()})
  },
  mounted() {
    //   this.onLoad()
  },
}

</script>
<style lang="less" scoped>
.commentpb{
    padding-bottom: 1.2rem;
}

</style>